<template>
	<!-- 最上面卡片 -->
	<div v-if="editDate" class="detal-box">
		<TopCard @tabChange="tabChange" />
		<div v-show="activeIndex == 1">
			<!-- 基本信息 -->
			<BasicForm ref="basic" @getVariable="hqVariable" :importOk="importOk" />
			<!-- 配置信息 -->
			<div v-if="tableName.includes('APP') || tableName.includes('PC')">
				<ConfigureForm ref="gure" :appAccess="appAccess" @handleClickIndex="handleClick" />

				<template v-if="showMd">
					<!-- 0灰名单   1黑名单   2白名单 -->
					<!-- 灰度名单 -->
					<GrayscaleTable configKey="2" :isblack="'0'" />
					<!-- 黑名单 -->
					<GrayscaleTable configKey="2" :isblack="'1'" />
					<!-- 白名单 -->
					<GrayscaleTable v-if="appAccess.length == 1 && appAccess[0] == 2" configKey="2" :isblack="'2'" />
				</template>


				<!-- 附件 -->
				<div v-if="appAccess.length > 1 && tableName.includes('APP') && tableName.includes('PC')">
					<AnnexFormNew v-show="indexCurunt === '1'" ref="annex" :importOk="importOk" type="PC" />
					<AnnexFormNew v-show="indexCurunt === '2'" ref="annex1" :importOk="importOk" type="APP" />
				</div>
				<div v-else>
					<AnnexFormNew ref="annex" :importOk="importOk" :type="tableName.includes('PC') ? 'PC' : 'APP'" />
				</div>
			</div>

		</div>
		<ProcessHistory v-show="activeIndex == 2" :datas="[]" />
		<FlowChart v-show="activeIndex == 3" :datas="chartData" />
		<!-- 按钮 -->
		<div class="uiue-card btn" :class="{ btnposi: activeIndex == 2 || activeIndex == 3 }">
			<div class="btnBottom">
				<a-button class="bt1" :loading="btnloding" @click="backs">取消</a-button>
				<!-- 以后的测试环境才展示这个按钮 -->
				<a-upload v-if="isImport" :showUploadList="false" accept=".json" :customRequest="importForm">
					<div class="uploadBtn">
						<a-button class="bt1" type="primary" :loading="btnloding">导入</a-button>
					</div>
				</a-upload>
				<a-button type="primary" :loading="btnloding" @click="submit">提交审批</a-button>
			</div>
		</div>
	</div>
	<a-modal v-model:visible="visible" title="提示" @ok="handleOk" width="1100px">
		<p>
			<exclamation-circle-filled style="margin-right: 6px; color: red" />{{
		`此次变更走${upOrEdit ? '编辑' : '升级'}流程`
	}}
		</p>
		<p v-if="!upOrEdit" style="color: red">请确认是否重新上传了网络打通结果的图片</p>
		<img v-if="upOrEdit" style="width: 1058px; height: 86px" src="@/assets/images/edit.png" />
		<img v-else style="width: 1058px; height: 86px" src="@/assets/images/up.png" />
	</a-modal>
	<PickPeople ref="pick" @succses="setUser" @cancel="setCancel" :peoTit="peoTit" v-if="roleList.length > 0 && !pcflow"
		:roleList="roleList" :isTwo="isTwo" />
	<PickPeoplea ref="pick" @succses="setUser" @cancel="setCancel" :peoTit="peoTit" v-if="roleList.length > 0 && pcflow"
		:roleList="roleList" />
</template>

<script setup name="appinfoForm">
import { Modal, message } from 'ant-design-vue';
import { createVNode } from 'vue';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import tool from '@/utils/tool'
import appInfoApi from '@/api/biz/appInfoApi'
import bizRoleApi from '@/api/biz/bizRoleApi'
import approvalApi from '@/api/biz/approvalApi'
import appGrayscaleApi from '@/api/biz/appGrayscaleApi'
import TopCard from './topCard.vue'
import BasicForm from './basicForm.vue'
import ConfigureForm from './configure/index.vue'
import AnnexFormNew from './annexFormNew.vue'
import ProcessHistory from '@/components/ProcessHistory/index.vue'
import FlowChart from '@/components/FlowChart/index.vue'
import PickPeople from '@/components/pickPeople/index.vue'
import PickPeoplea from '@/components/pickPeople/indexa.vue'
import { cloneDeep } from 'lodash-es'
import { useRouter, useRoute } from 'vue-router'
import store from '@/store'
import sysConfig from '@/config/index'

const router = useRouter()
const route = useRoute()
const pick = ref(null) // 选人组件的显示隐藏
const basic = ref(null)
const annex = ref(null)
const annex1 = ref(null)
const gure = ref(null)
const activeIndex = ref('1')
const formData = ref({})
const editDate = ref()
const btnloding = ref(false)
const visible = ref(false)
// 双端接入
const appAccess = ref([])
// 是什么类型的流程
let flowType = ref({})
// //详情接口 调用
const formTypeId = route.query.formType
const version = route.query.version
const isTest = route.query.isTest
const isImport = route.query.isImport
const tableName = route.query.tableName
let isPcTodo = ref('1')
let isPcReadtodo = ref('1')

const chartData = ref()
const getChart = async (index) => {
	const types = [
		{ key: '1', oid: 'concentrate_app_create_or_upgrade' },
		{ key: '2', oid: 'province_app_create_or_upgrade' },
		{ key: '3', oid: 'province_app_create_or_upgrade' },
		{ key: '4', oid: 'concentrate_app_create_or_upgrade' },
		{ key: '99', oid: 'app_edit_or_down' }
	]
	const id = types.find((v) => v.key == index).oid
	chartData.value = await approvalApi.getFlowchartByFlow({ id })
}
const indexCurunt = ref('1')

const handleClick = (index) => {
	indexCurunt.value = index
}
// 显示灰度和黑名单
const showMd = computed(() => {
	let bool = false
	if (tableName.includes("APP") && !tableName.includes("PC") && editDate.value) {
		if (editDate.value?.appInfoAppPropertiesAddParam?.accesssBefore == 2) {
			bool = true
		}
	}
	if (tableName.includes("APP") && tableName.includes("PC") && indexCurunt.value == 2) {
		bool = true
	}
	return bool
})

const detailDate = async () => {
	// if (isTest) {
	// 	// 获取测试表的主要信息
	// 	editDate.value = await appInfoApi.getdetailByappId({ appId: formTypeId })
	// 	getChart(editDate.value.appRange)
	// } else {
	// 	editDate.value = await appInfoApi.appInfoDetail({ appId: formTypeId })
	// }
	editDate.value = await appInfoApi.appInfoDetail({ appId: formTypeId, type: '2' })
	appAccess.value = editDate.value.appAccess ? editDate.value.appAccess.split(',') : []
	isPcTodo.value = editDate.value.isPcTodo ? editDate.value.isPcTodo : '1'
	isPcReadtodo.value = editDate.value.isPcReadtodo ? editDate.value.isPcReadtodo : '1'
	if (tableName.includes('APP') && !tableName.includes('PC') && appAccess.value.length > 1) {
		indexCurunt.value = '2'
	}
}
// 导入
const importOk = ref(false)
const importForm = async (file) => {
	const form = new FormData()
	form.append('file', file.file)
	let datas = await appInfoApi.testImport(form)
	// 详情信息供子组件展示使用
	store.dispatch('setImportData', datas)
	importOk.value = true


	appAccess.value = datas.appAccess ? datas.appAccess.split(',') : []
	isPcTodo.value = datas.isPcTodo ? datas.isPcTodo : '1'
	isPcReadtodo.value = datas.isPcReadtodo ? datas.isPcReadtodo : '1'
}
provide('importOk', importOk)
// formTypeId 为id   id有值 就走编辑  没值 走新增
provide('editDate', '')
provide('detailDate', '')
if (formTypeId) {
	detailDate()
	// 不是生产接入才请求这个
	if (!isTest) {
		getChart('99')
	}
	provide('editDate', editDate)
	provide('detailDate', editDate)
} else {
	provide('editDate', '')
	editDate.value = '1'
}

// 监听基本信息中的用户范围展示不同的流程图
watch(
	() => basic.value?.appRange,
	(newValue, oldValue) => {
		if (formTypeId && !isTest) {
			getChart('99')
		} else {
			getChart(newValue)
		}
	}
)

// 获取选人组件的角色
let roleList = ref([])
const getRoleList = async (params) => {
	const query = await appInfoApi.getFlow(params)
	const obj = {
		roleId: query.flow,
		searchKey: (formTypeId && !isTest) ? formData.value.editAppType : formData.value.appAccess,
		ascriptionId: formData.value.platformBelongId,
		appRange: formData.value.appRange,
		appId: formTypeId ? editDate.value.appId : ''
	}
	if (roleList.value.length == 0) {
		roleList.value = await bizRoleApi.getList(obj)
		if (roleList.value.length == 0) {
			Modal.confirm({
				title: '提示',
				icon: createVNode(ExclamationCircleOutlined),
				content: '当前环节无可选人员，请联系双门户管理员hqs-swxreq@chinaunicom.cn',
				okText: '确认',
				cancelText: '取消',
			});
		}
	}

	if (pick.value) {
		pick.value.setVisible(true)
	}
}


// tab切换事件
const tabChange = (index) => {
	activeIndex.value = index
}

// 是否接入pc待办
provide('isPcTodo', isPcTodo)
// 是否接入pc待阅
provide('isPcReadtodo', isPcReadtodo)

// 根据type给不同的变量赋值
const hqVariable = (e, type) => {
	if (type === 'appAccess') appAccess.value = e
	if (type === 'isPcTodo') isPcTodo.value = e
	if (type === 'isPcReadtodo') isPcReadtodo.value = e
	// if (type === 'isAppTodo') isAppTodo.value = e
	// if (type === 'isAppReadtodo') isAppReadtodo.value = e
}
// 给h5参数信息赋值
const setParam = () => {
	const obj1 = {}
	let arr = []
	obj1[formData.value.appName] = {
		appid: editDate.value.appInfoAppPropertiesAddParam.appAppId ? editDate.value.appInfoAppPropertiesAddParam.appAppId : editDate.value.appCode,
		appname: formData.value.appName,
		id: editDate.value.appInfoAppPropertiesAddParam.appAppId ? editDate.value.appInfoAppPropertiesAddParam.appAppId : editDate.value.appCode,
		params: {
			app_name: '',
			app_type: '', // db || yb || dy || yy
			tag_type: '',
			encode_url: '',
			title: '',
			url: ''
		},
		subsystem: '其他',
		system: formData.value.appName,
		tagtype: '其他'
	}

	if (formData.value.isAppTodo === '1' && editDate.value.isAppTodo !== formData.value.isAppTodo) {
		// 接入待办
		let appType = ['db', 'yb']
		appType.forEach((v) => {
			let obj = cloneDeep(obj1)
			obj[formData.value.appName].params.app_type = v
			arr.push(obj)
		})
	}
	if (formData.value.isAppReadtodo === '1' && editDate.value.isAppReadtodo !== formData.value.isAppReadtodo) {
		// 接入待阅
		let appType = ['dy', 'yy']
		appType.forEach((v) => {
			let obj = cloneDeep(obj1)
			obj[formData.value.appName].params.app_type = v
			arr.push(obj)
		})
	}
	if (arr.length > 0) {
		formData.value.appInfoAppPropertiesAddParam.param = JSON.stringify({ ...arr })
	}
}

const lastClickTime = ref(0)
const clickInterval = ref(1000) // 定义点击间隔为1秒
// 效验表单
const submit = async () => {
	const currentTime = Date.now();
	if (currentTime - lastClickTime.value < clickInterval.value) {
		// 时间间隔过小，直接返回
		return;
	}
	lastClickTime.value = currentTime;



	const config = sysConfig.DEVICE_CONFIG
	// 调用子组件basic的校验方法并返回子组件的formData
	const basicVali = await basic.value.handleValidate()
	if (basicVali) {
		formData.value = cloneDeep(basicVali)
	} else {
		message.warning('请完善基本信息')
		return false
	}
	let verify = ''
	// if (isTest) {
	// 	formData.value.editAppType = appAccess.value.length > 1 ? 's' : appAccess.value[0]
	// 	if (appAccess.value.length > 1) {
	// 		// 多端
	// 		verify = 'PC,APP'
	// 	} else {
	// 		// 单端
	// 		verify = appAccess.value[0] == 1 ? 'PC' : 'APP'
	// 	}
	// } else {
	if (formTypeId) {
		// 变更
		verify = route.query.tableName
		// 告诉后台修改的是什么类型的应用
		if (config.find((v) => tableName.includes(v.oid))) {
			let str = config.find((v) => tableName.includes(v.oid)).key
			formData.value.editAppType = str
		} else {
			formData.value.editAppType = '1'
		}

	} else {
		// 新增和被退回到审批人的工单
		if (appAccess.value.length > 1) {
			// 多端
			verify = 'PC,APP'
		} else {
			// 单端
			verify = appAccess.value[0] == 1 ? 'PC' : 'APP'
		}
	}

	// 调用孙子组件portalForm的校验方法
	if (appAccess.value.includes('1') && verify.includes('PC')) {
		const portal = await gure.value.portalValidate()
		if (portal) {
			formData.value.appInfoPcPropertiesAddParam = cloneDeep(portal)
		} else {
			message.warning('请完善门户端HTML配置信息')
			return false
		}
	}
	// 调用孙子组件mobileForm的校验方法
	if (appAccess.value.includes('2') && verify.includes('APP')) {
		const mobile = await gure.value.mobileValidate()
		if (mobile) {
			formData.value.appInfoAppPropertiesAddParam = cloneDeep(mobile)
			setParam()
		} else {
			message.warning('请完善移动端HTML配置信息')
			return false
		}
	}
	// 调用孙子组件androidValidate的校验方法
	if (appAccess.value.includes('3') && verify.includes('ANDROID')) {
		const mobile = await gure.value.androidValidate()
		if (mobile) {
			formData.value.appInfoAndroidPropertiesAddParam = cloneDeep(mobile)
		} else {
			message.warning('请完善Android配置信息')
			return false
		}
	}
	// 调用孙子组件iosValidate的校验方法
	if (appAccess.value.includes('4') && verify.includes('IOS')) {
		const mobile = await gure.value.iosValidate()
		if (mobile) {
			formData.value.appInfoIosPropertiesAddParam = cloneDeep(mobile)
		} else {
			message.warning('请完善Ios配置信息')
			return false
		}
	}
	// 调用孙子组件umapValidate的校验方法
	if (appAccess.value.includes('5') && verify.includes('UMAP')) {
		const mobile = await gure.value.umapValidate()
		if (mobile) {
			formData.value.appInfoUmapPropertiesAddParam = cloneDeep(mobile)
		} else {
			message.warning('请完善Umap配置信息')
			return false
		}
	}




	// 调用子组件annex的校验方法并返回子组件的formData
	if (annex.value) {
		const annexVali = await annex.value.handleValidate()
		if (annexVali) {
			if (verify.includes('PC')) {
				formData.value.appInfoPcPropertiesAddParam = { ...formData.value.appInfoPcPropertiesAddParam, ...annexVali }
			} else {
				formData.value.appInfoAppPropertiesAddParam = { ...formData.value.appInfoAppPropertiesAddParam, ...annexVali }
			}
		} else {
			message.warning('请完善附件信息')
			return false
		}
	}


	// 双端APP的时候
	if (annex1.value) {
		const annexVali11 = await annex1.value.handleValidate()
		if (annexVali11) {
			formData.value.appInfoAppPropertiesAddParam = { ...formData.value.appInfoAppPropertiesAddParam, ...annexVali11 }
		} else {
			message.warning('请完善附件信息')
			return false
		}
	}
	onOK()
	// 数据格式化并提交
}
//路由返回
const backs = () => {
	store.commit('removeViewTags', route)
	router.back()
}
const fitFile = (arr) => {
	let str = ''
	if (arr != null && arr.length > 0) {
		str = JSON.stringify(arr)
	}
	return str
}

const fitChange = (formData, editData, type = '') => {
	const fit = ['appInfoPcPropertiesAddParam', 'appInfoAppPropertiesAddParam', 'appApprovalUsers', 'pcApprovalUsers', 'appContact_s', 'editAppType']
	const arr = Object.keys(formData).map(v => {
		if (formData[v] != editData[v] && !fit.includes(v) && (formData[v] || editData[v])) {
			return { changeTerm: `${type}${v}`, changeBeforeContent: editData[v], changeAfterContent: formData[v] }
		}
	}).filter(s => s)
	return arr
}

// 提交表单
const onOK = () => {
	if (Array.isArray(formData.value.appAccess)) {
		formData.value.appAccess = formData.value.appAccess.join(',')
	}
	if (formData.value.appShortName) {
		formData.value.appShortName = JSON.stringify(formData.value.appShortName)
	}
	// 数组转化字符串
	// if (Array.isArray(formData.value.appInfoPcPropertiesAddParam.compatibility)) {
	// 	formData.value.appInfoPcPropertiesAddParam.compatibility = formData.value.appInfoPcPropertiesAddParam.compatibility.join(',')
	// }
	if (route.query.tableName) {
		if (route.query.tableName.includes('PC')) {
			if (Array.isArray(formData.value.appInfoPcPropertiesAddParam.compatibility)) {
				formData.value.appInfoPcPropertiesAddParam.compatibility = formData.value.appInfoPcPropertiesAddParam.compatibility.join(',')
			}
		}
	} else {
		if (formData.value.appInfoPcPropertiesAddParam && Array.isArray(formData.value.appInfoPcPropertiesAddParam.compatibility)) {
			formData.value.appInfoPcPropertiesAddParam.compatibility = formData.value.appInfoPcPropertiesAddParam.compatibility.join(',')
		}
	}



	console.log('提交咯+++++++++++')
	// console.log(formData.value)
	// return

	if (formTypeId) {
		//编辑还是升级
		editOrUpgrades()
	} else {
		// 新增
		flowType.value = {
			type: '0',
			appRange: formData.value.appRange,
			isPcTodo: formData.value.isPcTodo,
			isAppTodo: formData.value.isAppTodo,
			appAccess: formData.value.appAccess
		}
		getRoleList(flowType.value)
	}
}
const lastOk = () => {
	if (formTypeId) {
		// 对比拿出此次变更修改的字段
		let arr = [], arrPC = [], arrApp = [];
		arr = fitChange(formData.value, editDate.value)
		if (route.query.tableName.includes("PC")) {
			arrPC = fitChange(formData.value.appInfoPcPropertiesAddParam, editDate.value.appInfoPcPropertiesAddParam, 'pcConfig')
		}
		if (route.query.tableName.includes("APP")) {
			arrApp = fitChange(formData.value.appInfoAppPropertiesAddParam, editDate.value.appInfoAppPropertiesAddParam, 'appConfig')
		}
		const changeDetails = [...arr, ...arrPC, ...arrApp]

		btnloding.value = true
		// 如果存在APP复制名单
		if (route.query.tableName.includes('APP')) {
			const params = {
				appCode: editDate.value.appCode,
				appVersion: editDate.value.appInfoAppPropertiesAddParam.appVersion,
				toAppVersion: formData.value.appInfoAppPropertiesAddParam.appVersion,
			}
			appGrayscaleApi.copyedit(params)
		}
		console.log({ ...formData.value, ...currentRes.value, changeDetails, appId: formTypeId })
		// 变更
		appInfoApi.update({ ...formData.value, ...currentRes.value, changeDetails, appId: formTypeId })
			.then((res) => {
				backs()
			})
			.catch(() => {
				btnloding.value = false
				pcflow.value = false
				roleList.value = []
			})
		//编辑还是升级
		// visible.value = true
	} else {
		btnloding.value = true
		//新增
		appInfoApi.appInfoAdd(formData.value).then((res) => {
			btnloding.value = false
			backs()
		})
	}
}
// //编辑
// //升级
const upOrEdit = ref()
const handleOk = () => {
	let str = ''
	str = upOrEdit.value == true ? 'appEdit' : 'upgrade'
	// 如果是升级流程的待办清空网络打通文件
	// if (formData.value.networkConnFile.includes(editDate.value.networkConnFile)) {
	// 	message.warning('请重新上传网络打通结果')
	// 	return false
	// }
	btnloding.value = true
	visible.value = false
	appInfoApi[str](formData.value)
		.then((res) => {
			backs()
		})
		.catch(() => {
			btnloding.value = false
		})
}
const selectObj = ref({
	roleId: '',
	searchKey: '',
})
// 要偶的流程信息

const currentRes = ref({})
const pcflow = ref(false)
// 修改选人
const getRoleListEdit = async () => {
	roleList.value = await bizRoleApi.getList(selectObj.value)
	if (roleList.value.length == 0) {
		Modal.confirm({
			title: '提示',
			icon: createVNode(ExclamationCircleOutlined),
			content: '当前环节无可选人员，请联系双门户管理员hqs-swxreq@chinaunicom.cn',
			okText: '确认',
			cancelText: '取消',
		});
	}
	if (pick.value) {
		pick.value.setVisible(true)
	}
}

const zjEdit = async () => {
	try {
		await appInfoApi.updateTest({ ...formData.value, ...currentRes.value, appId: formTypeId })
		backs()
	} catch (error) {
		console.log(error)
	}
}





const peoTit = ref('选人')
const isTwo = ref(false)

//编辑还是升级
const editOrUpgrades = () => {
	// const editArr = ['appEdit', 'pcEdit'];
	// const upArr = ['appUpgrade', 'pcUpgrade'];
	appInfoApi.checkGoFlow(formData.value).then((res) => {
		// 是否弹2次窗
		currentRes.value = res;
		if (res?.appFlow === 'test' || res?.pcFlow === 'test') {
			// 直接修改
			zjEdit()
			return false
		}

		selectObj.value.ascriptionId = formData.value.platformBelongId;
		selectObj.value.appRange = formData.value.appRange;

		// 显示哪个选人
		if (res?.appFlow && res?.pcFlow) {
			isTwo.value = true
		}
		if (isTwo.value) {
			// 如果弹2次窗， 那先请求app的人
			if (res?.appFlow) {
				peoTit.value = res?.appUpgrade ? '移动端升级' : res?.appEdit ? '移动端修改' : '选人';
				selectObj.value.searchKey = '2'
				selectObj.value.roleId = res?.appFlow
			}
			getRoleListEdit()
		} else {
			if (res?.appFlow) {
				peoTit.value = res?.appUpgrade ? '移动端升级' : res?.appEdit ? '移动端修改' : '选人';
				selectObj.value.searchKey = '2'
				selectObj.value.roleId = res?.appFlow
				getRoleListEdit()
			}
			if (res?.pcFlow) {
				peoTit.value = res?.pcUpgrade ? '门户端升级' : res?.pcEdit ? '门户端修改' : '选人';
				selectObj.value.searchKey = '1'
				selectObj.value.roleId = res?.pcFlow
				if (res?.pcFlow === 'pc_upgradation_no_sync') {
					pcflow.value = true
				}
				getRoleListEdit()
			}
			if (!res?.pcFlow && !res?.appFlow) {
				message.success('未进行任何变更，无程发起')
				backs()
			}
		}
	})
}
// const getPendTypeList = () => {
// 	const arr = ['pending', 'reading']
// 	const params = { type: 'pending' }
// 	appInfoApi.getPendTypeList(params).then((res) => {
// 		console.log(res)
// 	})
// }
// getPendTypeList()
// 人员选择完成
const setUser = (user) => {
	if (user && user.length > 0) {
		pick.value.setVisible(false)
		if (formTypeId) {
			if (isTwo.value) {
				// 如果弹2次窗， 那先请求app的人
				formData.value.appApprovalUsers = user
				// app的人赋值后再请求pc的人
				roleList.value = []
				peoTit.value = currentRes.value?.pcEdit ? '门户端修改' : '门户端升级';
				selectObj.value.searchKey = '1'
				selectObj.value.roleId = currentRes.value?.pcFlow
				if (currentRes.value?.pcFlow === 'pc_upgradation_no_sync') {
					pcflow.value = true
				}
				getRoleListEdit()
				isTwo.value = false
			} else {
				if (currentRes.value?.pcFlow && peoTit.value.includes('门户端')) {
					formData.value.pcApprovalUsers = user
				}
				if (currentRes.value?.appFlow && peoTit.value.includes('移动')) {
					formData.value.appApprovalUsers = user
				}
				// if (currentRes.value?.appEdit && currentRes.value?.pcEdit) {
				// 	formData.value.appApprovalUsers = user;
				// 	formData.value.pcApprovalUsers = []
				// }
				lastOk()
			}
		} else {
			formData.value.approvalUsers = user
			lastOk()
		}
	}
}
const setCancel = () => {
	roleList.value = []
}

</script>

<style lang="less" scoped>
.btn {
	text-align: right;

	.bt1 {
		margin-right: 10px;
	}
}

.btnposi {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 100%;
}

.form-box {
	margin-top: 14px;
	padding-bottom: 30px;

	&-inp {
		border-radius: 4px;
		border: 1px solid rgb(206, 206, 206);
	}
}
</style>
